/* 用户管理- 系统管理员 */
<template>
  <div>
    <Card :bordered="false">
        <p slot="title">
          系统管理员
          <Button type="info" style="float:right">添加</Button>
        </p>
        <p class="searchInput">
           <Input search enter-button="搜索" placeholder="请输入关键字" />
           <Table border :columns="columns1" :data="data1"></Table>
           <Page :total="100" show-total />
        </p>
    </Card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      showHeader: false,
      tab0: true,
      tab1: true,
      tab2: true,
      columns1: [
        {
          title: "职位名称",
          key: "position",
          align: "center"
        },
        {
          title: "姓名",
          key: "name",
          align: "center"
        },
        {
          title: "管理权限",
          key: "jurisdiction",
          align: "center"
        },
        {
          title: "联系电话",
          key: "phone",
          align: "center"
        },
        {
          title: "账号密码",
          align: "center",
          render: (h, params) => {
            return h(
              "Select",
              {
                props: {
                  value: ""
                },
                on: {
                  "on-change": event => {}
                }
              },
              [
                h(
                  "Option",
                  {
                    props: {
                      value: "1"
                    }
                  },
                  "账号：zhangsan"
                ),
                h(
                  "Option",
                  {
                    props: {
                      value: "2"
                    }
                  },
                  "账号：lisi"
                )
              ]
            );
          }
        },
        {
          title: "操作",
          align: "center",
          render: (h, params) => {
            return h("div", [
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                    color: "#ffffff",
                    background: "#2996ff",
                    border: "none",
                    padding: "0px 5px"
                  },
                  on: {
                    click: () => {
                      this.show(params.index);
                    }
                  }
                },
                "查看"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                    color: "#ffffff",
                    background: "#19be6b",
                    border: "none",
                    padding: "0px 5px"
                  },
                  on: {
                    click: () => {
                      this.show(params.index);
                    }
                  }
                },
                "修改"
              )
            ]);
          }
        }
      ],
      data1: [
        {
          position: "系统管理员",
          name: "张三"
        },
        {
          position: "系统管理员",
          name: "张三"
        },
        {
          position: "系统管理员",
          name: "张三"
        }
      ],
      columns2: [
          {
              title: '序号',
              key: 'num'
          },
          {
              title: '所属一级账号',
              key: 'affiliation'
          },
          {
              title: '创建的二级账号',
              key: 'secondLevel'
          },
          {
              title: '创建日期',
              key: 'data'
          }
        ],
         data2: [
          {
              num: '1',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '2',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '3',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '4',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '5',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '6',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '7',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '8',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '9',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },
          {
              num: '10',
              affiliation: '',
              secondLevel: '王五 | 部门经理',
              data: '2016-10-03'
          },

        ],
    };
  },
  methods: {
    handleTabRemove(name) {
      this["tab" + name] = false;
    },
    rowClick() {
      // this.$router.push("/admin/main/IndexOperation");
    }
  }
};
</script>

<style scoped lang="less">
.indexTop {
  .ivu-card {
    height: 150px;
    div {
      img {
        width: 50px;
        height: 50px;
      }
    }
  }
}
</style>
